<template>
  <div v-loading.fullscreen.lock="loading2"
       element-loading-text="正在打印中。。。"
       element-loading-spinner="el-icon-loading"
       element-loading-background="rgba(0, 0, 0, 0.6)">
    <v-header></v-header>
    <div>
      <div class="ris_cont">
        <div class="collar_cont_headPar">
        <table class="collar_cont_head">
          <tr>
            <td>编号</td>
            <td><input type="text"  v-model="assignInfo.pid"/></td>
            <td>姓名</td>
            <td><input type="text" v-model="assignInfo.name"/></td>
            <td>性别</td>
            <td>
              <select v-model="assignInfo.sex">
                <option></option>
                <option>男</option>
                <option>女</option>
              </select>
            </td>
            <td>年龄</td>
            <td>
              <input type="text" class="collar_cont_head_age" v-model="assignInfo.beginAge"/>
              <span class="collar_cont_head_span">至</span>
              <input type="text" class="collar_cont_head_age" v-model="assignInfo.endAge"/>
              <!--<select class="collar_cont_head_ageUnit">-->
                <!--<option>岁</option>-->
                <!--<option>月</option>-->
                <!--<option>日</option>-->
              <!--</select>-->
            </td>
            <td>患者类型</td>
            <td>
              <select v-model="assignInfo.patType">
                <option value=""></option>
                <option>门诊</option>
                <option>住院</option>
                <option>急诊</option>
              </select>
            </td>
          </tr>
          <tr>
            <td>设备类型</td>
            <td>
              <select v-model="assignInfo.eqpType" @change="getEqpName">
                <!--<option value=""></option>-->
                <option v-for="item in eqpTypeList" v-bind:value="item">{{item.name}}</option>
              </select>
            </td>
            <td>设备名称</td>
            <td>
              <select v-model="assignInfo.eqpName">
                <!--<option></option>-->
                <option v-for="item in eqpList" v-bind:value="item.code">{{item.name}}</option>
              </select>
            </td>
            <td>影像号</td>
            <td><input type="text" v-model="assignInfo.accessNo"/></td>
            <td>影像数量</td>
            <td>
              <input type="text" class="collar_cont_head_num" v-model="assignInfo.beginNum">
              <span class="collar_cont_head_numText">至</span>
              <input type="text" class="collar_cont_head_num" v-model="assignInfo.endNum"/>
            </td>
            <td>检查部位</td>
            <td>
              <!--<select v-model="assignInfo.partName">-->
                <!--<option v-for="item in partList" :label="item.name">{{item.name}}</option>-->
              <!--</select>-->
              <div class="drop_down_menuN">
                <input type="text" placeholder="输入检索信息" v-model="assignInfo.partName"/>
                <ul class="scroll2">
                  <li v-for="item in partList" @click="assignInfo.partName=item.name">{{item.name}}</li>
                </ul>
              </div>
            </td>
          </tr>
          <tr>
            <td>登记日期</td>
            <td><input type="date" v-model="assignInfo.beginRegTime"/></td>
            <td>至</td>
            <td><input type="date" v-model="assignInfo.endRegTime"/></td>
            <!--<td>报告人</td>-->
            <!--<td>-->
              <!--<select v-model="assignInfo.destName">-->
                <!--<option></option>-->
                <!--<option v-for="item in docList">{{item.name}}</option>-->
              <!--</select>-->
            <!--</td>-->
            <td>紧急程度</td>
            <td>
              <select v-model="assignInfo.emergstatus">
                <option></option>
                <option>紧急</option>
                <option>普通</option>
              </select>
            </td>
            <td>分配状态 </td>
            <td>
              <select v-model="assignInfo.assignStatus">
                <option :value="1">已登记</option>
                <option :value="5">已拍片</option>
                <option :value="10">已分配</option>
                <option :value="15">预审核</option>
                <option value="20,25">已审核,已打印</option>
                <!--<option :value="25">已打印</option>-->
                <option :value="30">已取片</option>
                <option value="">全部</option>
                <!--<option :value="10">已分配</option>-->
              </select>
            </td>
            <td></td>
            <td>
            </td>
          </tr>
        </table>
          <div class="collar_cont_head_right collar_cont_head_btn">
            <!--<button class="button btn_blur" @click="assignReport">分配</button>-->
            <button class="button btn_the_green Dist_allotment"  @click="getAssign">查询</button>
            <button class="button btn_blur Dist_allotment"  @click="printList">打印</button>
            <button class="button btn_green Dist_allotment"  @click="confirmmsg">确认拍片</button>
          </div>
      </div>
        <div class="collar_content">
        <table class="collar_contentTable" v-loading="loading" id="tableClickSort">
          <thead>
          <tr>
            <!--<th><input type="checkbox" @click="checkedAll" v-model="checked"></th>-->
            <th><input type="checkbox" v-model="checkAlla" @click="checkAll()" id="thisCheck"/></th>
            <th>队列号</th>
            <th>姓名</th>
            <th>拼音码</th>
            <th>病历号</th>
            <th>登记时间</th>
            <th>患者类型</th>
            <th>紧急程度</th>
            <th>性别</th>
            <th>年龄</th>
            <!--<th>出生日期</th>-->
            <th>影像号</th>
            <th>检查部位</th>
            <th>设备</th>
            <th>设备类型</th>
            <th>状态</th>
            <th>申请科室</th>
            <th>申请医生</th>
            <th>操作</th>
            <!--<th>图像数量</th>-->
            <!--<th>拍片时间</th>-->
            <!--<th>报告分配人</th>-->
            <!--<th>分配时间</th>-->
            <!--<th>报告医师</th>-->

          </tr>
          </thead>
          <tbody>
          <tr v-for="item in assignList">
            <td><input type="checkbox" @click="checkOne()" v-model="checkPids" :value="item"/></td>
            <!--<td><input type="checkbox" v-model="checkBox" :value="item.infoId"></td>-->
            <td>{{item.queuenum}}</td>
            <td style="position: relative;width: 120px;">{{item.cname}}
              <img src="../../../static/img/search/call.png" @click="call(item.infoId)" style="width: 16px;padding: 8px 15px;position: absolute;top: 5px;right: 0px;"/></td>
            <td>{{item.ename}}</td>
            <td>{{item.pid}}</td>
            <td>{{item.regTime | formatday}}</td>
            <td>{{item.patType}}</td>
            <td>
              <el-tag type="danger" v-if="item.emergStatus=='紧急'">紧急</el-tag>
              <el-tag type="success" v-else >普通</el-tag>
            </td>
            <td>{{item.sex}}</td>
            <td>{{item.age}}</td>
            <!--<td>{{item.birthday}}</td>-->
            <td>{{item.accessNo}}</td>
            <!--检查部位-->
            <td v-if="item.partName.length>8" :title="item.partName">{{item.partName|textLength8}}</td>
            <td v-else>{{item.partName}}</td>

            <td>{{item.eqpName}}</td>
            <td style="display: none">{{item.eqpCode}}</td>
            <td>{{item.eqpTypeName}}</td>
            <td v-if="item.statusCode==1">已登记</td>
            <td v-if="item.statusCode==5">已拍片</td>
            <td v-if="item.statusCode==10">已分配</td>
            <td v-if="item.statusCode==15">预审核</td>
            <td v-if="item.statusCode==20">已审核</td>
            <td v-if="item.statusCode==25">已打印</td>
            <td v-if="item.statusCode==30">已取片</td>
            <td>{{item.deptname}}</td>
            <td>{{item.applydocname}}</td>
            <td style="display: none">{{item.repuserCode}}</td>
            <td style="display: none">{{item.audituserCode}}</td>
            <td>
              <button class="button btn_the_green Dist_allotment" @click="call(item.infoId)">呼叫</button>
              <button class="button btn_yellow Dist_allotment" :style="showButton(item.statusCode)?{background:'#aaa !important'}:{}" @click="repeal2(item)" :disabled="showButton(item.statusCode)">撤销审核
                <!--<img src="../../../static/img/reportview/delete.png"/>-->
              </button>
              <!--<button class="button btn_the_green Dist_allotment" @click="call(item.infoId)">呼叫</button>-->
            </td>
            <!--<td>{{item.imagecount}}</td>-->
            <!--<td>{{item.studate}}</td>-->
            <!--<td>{{item.changeuserName}}</td>-->
            <!--<td>{{(item.changeTime) | formatday}}</td>-->
            <!--<td>{{item.destName}}</td>-->
          </tr>
          </tbody>
        </table>
      </div>
      </div>
    </div>
    <!--<div class="modal Dist_modal" style="display: block;" v-show="showAssign">-->
    <!--<div>-->
      <!--<p class="Dist_modal_head line_height_32">医师分配<span class="Dist_modal_cancel" @click="showAssign=false">X</span></p>-->
      <!--<ul class="Dist_modal_ul clear">-->
        <!--<li v-for="item in docList">-->
          <!--<div @click.self="checkDoc(item)">{{item.name}}-->
            <!--<span v-show="showCheckDoc(item.code)">√</span>-->
          <!--</div>-->
        <!--</li>-->
      <!--</ul>-->
      <!--<div class="Dist_modal_footBtn">-->
        <!--<button class="button btn_blur" @click="beginAssign">确认</button>-->
        <!--<button class="button btn_yellow Dist_modal_cancel" @click="showAssign=false">取消</button>-->
      <!--</div>-->
    <!--</div>-->
  <!--</div>-->
  </div>
</template>

<script>
  import Header from '@/components/Header/Header';
  import { Message, MessageBox,Notification } from 'element-ui'
  import * as assign from '@/api/assign'

  export default {
    components: {
      'v-header': Header
    },
    name: "index",
    data() {
      return {
        assignInfo: {
          pid:'',
          name:'',
          sex:'',
          beginAge:'',
          endAge:'',
          eqpType:'',
          eqpName:'',
          accessNo:'',
          partName:'',
          destCode:'',
          destName:'',
          beginTime:'',
          endTime:'',
          patType:'',
          emergstatus:'',
          beginNum:'',
          endNum:'',
          assignStatus:'1',
          beginRegTime:this.formatday(new Date()),
          endRegTime:this.formatday(new Date())
        },
        eqpTypeCode:'',
        assignList:'',    //大列表数据
        eqpTypeList:'',   //仪器型号列表
        eqpList:'',       //仪器列表
        partList:'',      //部位列表
        docList:'',       //报告人列表
        checkBox: [],     //选中的pid
        checkDocCode: [],     //选中的医生
        checked: false,
        loading: false,
        showAssign: false,    //医生选择框状态
        showPart: false,
        checkAlla:false,//监听全选
        checkPids: [],
        eqpCodes:[],
        loading2: false,
        confirmStatus:'',//确认拍片的返回状态
        usercode:'',//session 中usercode
        actorcode:'',//session --actorcode
        reportname:'',
        reportid:'',
        reporttype:'',
        // repealButton: false
        // thisCheck:true,//监听当前input全选
        // selectFlag: true
      }
    },
    created() {
      //查询大列表
      this.loading=true

      //设备类型
      assign.getEqpType().then(response => {
        this.eqpTypeList = response.eqptypeList;
        this.eqpList = response.equipList;
//        console.log(this.eqpTypeList)
        if(this.eqpTypeList.length==1){
          this.assignInfo.eqpType=response.eqptypeList[0];
        }
        if(this.eqpList.length==1){
          this.assignInfo.eqpName=response.equipList[0].code;
        }
        assign.getAssignList(this.assignInfo).then(response => {
          this.loading=false;
          this.assignList = response.data;
        })
      })
      //session信息
      assign.getSessionMsg().then(response=>{
        this.usercode = response.usercode;
        this.actorcode=response.actorcode;
      })
//      //设备名称
//      assign.getEqp(this.eqpTypeCode).then(response => {
//        this.eqpList = response.data;
//      })
      //部位名称
      assign.getPart().then(response => {
        this.partList = response.data;
      })
      //报告人
      assign.getPacsUser().then(response => {
        /*for (var i in response.data){
          response.data[i].selectFlag = false;
        }*/
        this.docList = response.data;
      })
    },
    methods: {
      //全选
      checkAll(){
        if(this.checkAlla){
          this.checkPids=[];
        }else if(!this.checkAlla){
          this.checkPids=this.assignList;
        }
      },
      checkOne(){
        this.checkAlla=false;
        /*if(this.checkPids.length==this.assignList.length){
          this.checkAlla=true;
        }*/
      },
      //当前日期
      formatday(date) {
        var seperator1 = "-";
        var month = date.getMonth() + 1;
        var strDate = date.getDate();
        if (month >= 1 && month <= 9) {
          month = "0" + month;
        }
        if (strDate >= 0 && strDate <= 9) {
          strDate = "0" + strDate;
        }
        var dateStr = date.getFullYear() + seperator1 + month + seperator1 + strDate
        return dateStr;
      },
      //点击分配
      assignReport() {
        this.showAssign=true;
      },
      //获得仪器
      getEqpName() {
        if (this.assignInfo.eqpType==="" || this.assignInfo.eqpType==undefined) {
          assign.getEqp("").then(response => {
            this.eqpList = response.data;
          })
        } else {
          assign.getEqp(this.assignInfo.eqpType.code).then(response => {
            this.eqpList = response.data;
          })
        }
      },
      //多条件查询
      getAssign() {
        this.loading=true;
        assign.getAssignList(this.assignInfo).then(response => {
          this.loading=false;
          this.assignList = response.data;
        })
      },

      //选择医生
      checkDoc(item) {
        // item.selectFlag=!item.selectFlag;
        for(var i in this.checkDocCode) {
          if(this.checkDocCode[i]==item.code){
            this.checkDocCode.splice(i,1);
            return;
          }
        }
        this.checkDocCode.push(item.code);
      },
      //开始分配
      beginAssign() {
        assign.assignReportByPid(this.checkBox, this.checkDocCode).then(response => {
          this.showAssign = false;
          this.getAssign();
          this.checkBox=[];
          this.checkDocCode=[];
          this.$notify.success({
            title: '成功',
            message: response.data,
            duration: 2000,
            // offset: 100
          });
        })
      },
      //呼号
      call(infoId) {

       // this.$http.get(window.localStorage.url + "/reportAssign/call?infoId=" + infoId + "&eqpcode=" + eqpcode)
       //   .then(function (res) {
       //     if(res.data.data.status=='SUCCESS') {
       //       this.$notify.success({
       //             title: '成功',
       //             message: res.data.data,
       //             duration: 1000,
       //             // offset: 100
       //           });
       //     }
       //   });
        assign.call(infoId).then(response => {
          console.log(response.sendmsg);
          if(response.status=='SUCCESS'){
            this.$notify.success({
              title: '成功',
              message: response.data,
              duration: 1000,
              // offset: 100
            });
          }
          else {
            this.$notify.error({
              title: '失败',
              message: response.data,
              duration: 1000,
              // offset: 100
            });
          }
        })
     },
      //撤销审核
      repeal2(item) {
         var infoId=item.infoId;
         var repuserCode =item.repuserCode;
         var audituserCode= item.audituserCode;
         if(this.usercode==repuserCode||this.usercode==audituserCode||this.actorcode==7){
                   this.$confirm('是否确认撤销审核?', '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          assign.repeal(infoId).then(res => {
            this.getAssign();
            this.$notify({
              type: 'success',
              message: res.data
            });
          })
        }).catch(() => {
          this.$notify({
            type: 'info',
            message: '已取消审核'
          });
        });
         }
         else {
           this.$notify.info({
             message: '您没有撤销资格！',
             duration: 3000,
             offset: 35
           });
         }

      },
      //按钮显示隐藏
      showButton(statusCode) {
        if(eval(statusCode) >= 20) {
          return false;
        }else {
          return true;
        }
      },
      //确认拍片
      confirmmsg(){
        var pidss=[];
        for(var i in this.checkPids){
          pidss.push(this.checkPids[i].infoId);
        }
        const pids = pidss.join(",");
//        console.log(pids);

        assign.addPacsMsg(pids).then(response =>{
          this.confirmStatus =response.message;
          this.$notify.success({
            title: '成功',
            message: response.message,
            duration: 2000,
            // offset: 100
          });
        })
      },
      //批量打印
      printList() {
        var pidss=[];
        for(var i in this.checkPids){
          pidss.push(this.checkPids[i].infoId);
          if(eval(this.checkPids[i].statusCode) < 20){
            this.$notify.error({
              title: '失败',
              message: '存在未审核报告',
              duration: 1000,
              offset: 35
            })
            return false;
          }
          else {
            this.demo(this.checkPids[i].eqpCode,this.checkPids[i].infoId)
          }
        }
      },
      demo(code1,code2) {
        this.$http.get(window.localStorage.url + "/BaseEquip/getReportName?code=" + code1).then(function (res) {
          if (res.data.status == 'SUCCESS') {
//            console.log(res.data)
//            console.log(res.data.data.reportname)
            this.reportname = res.data.data.reportname == undefined ? "" : res.data.data.reportname;
            this.reportid = res.data.data.reportid == undefined ? "" : res.data.data.reportid;
            this.reporttype = res.data.data.reporttype == undefined ? "" : res.data.data.reporttype;
//            console.log("11...." + code1 + "..." + this.reportname + "..." + this.reporttype + "..." + code2 + "....22")
            this.demo1(code2,this.reportname,this.reporttype)
          }
        })
      },
      demo1(code,reportname,reporttype){
                      this.$http.get(window.localStorage.url + "/print/rptAll?pids=" + code + "&rptName=" + reportname + "&type=" + reporttype + "&actionname=" + "PRINT" + "&areacode=" + '1')
                .then(function (res) {
                  console.log(code+".."+reportname+"...."+""+reporttype);
                  if (res.data.status == 'SUCCESS') {
//                  console.log(res.data.url);
//                  console.log(res.data.data)
                    res.data.data.UPLOADFILEADDR = window.localStorage.url + res.data.data.UPLOADFILEADDR;
                    res.data.data.SAVEFILEADDR = window.localStorage.url + res.data.data.SAVEFILEADDR;
                    this.$http.post(res.data.url, JSON.stringify(res.data.data), {
                      headers: {
                        'Content-Type': 'application/x-www-form-urlencoded; charset=UTF-8'
                      }, credentials: false
                    }).then(response => {
//                    console.log(code);
                      if (response.data.STATUS == "OK") {
                        this.$notify({
                          title: '成功',
                          type: 'success',
                          message: '成功',
                          duration: 3000,
                          offset: 35
                        });
                        demo2(code);
                      }
                      else {
                        this.$notify({
                          title: '失败',
                          message: '打印失败',
                          duration: 3000,
                          offset: 35
                        });
                      }
                    })
                  }
                })
      },
      demo2(code){
        console.log(code);
        $this.$http.post(window.localStorage.url + "/pat/printStatus/" + code)
          .then(function () {
          })
      }
    },
    mounted(){
      $('.drop_down_menuN').on('click','li',function () {
        $(this).parent().hide();
      }).on('click','input',function () {
        $(this).siblings('ul').show();
      });
      $(document).bind('click',function (e) {
        var target = $(e.target);
        if(target.closest('.drop_down_menuN').length==0){
          $('.drop_down_menuN').children('ul').hide();
        }
      })

      new tHeadClickSort('tableClickSort');
      // $pg.drop_down_menu('.drop_down_menu');
    },
    computed: {

    },
    filters: {
      formatday(timestamp) {
        if(timestamp==undefined) {
          return "";
        }
        var seperator2 = ":";

        var date=new Date(timestamp);
        var seperator1 = "-";
        var month = date.getMonth() + 1;
        var strDate = date.getDate();
        if (month >= 1 && month <= 9) {
          month = "0" + month;
        }
        if (strDate >= 0 && strDate <= 9) {
          strDate = "0" + strDate;
        }
        var dateStr = date.getFullYear() + seperator1 + month + seperator1 + strDate+
          " " + (date.getHours()<10?"0"+date.getHours():date.getHours()) + seperator2
          + (date.getMinutes()<10?"0"+date.getMinutes():date.getMinutes()) +
          seperator2 + (date.getSeconds()<10?"0"+date.getSeconds():date.getSeconds());
        return dateStr;
      },
      textLength8(text) {
        if (text.length > 8) {
          text = text.slice(0, 7) + '..'
        }
        return text;
      }
    }
  }
</script>

<style scoped>

  /*八、 input输入带下拉和检索*/
  .drop_down_menuN{
    display: inline-block;
    width: 100%;
    height: 32px;
    position: relative;
  }
  .drop_down_menuN>input{
    width: 100%;
    height: 100%;
  }
  .drop_down_menuN>ul{
    position: absolute;
    left: 0;
    top: 36px;
    border: 1px solid #ddd;
    width: 100%;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    height: 240px;
    overflow: auto;
    z-index: 1;
    background-color: #fff;
    display: none;
  }
  .drop_down_menuN>ul li{
    border-bottom: 1px solid #ddd;
    box-sizing: border-box;
    -webkit-box-sizing: border-box;
    line-height: 32px;
    cursor: pointer;
    padding: 0 10px;
  }



  /*内容*/

  .collar_cont_head_right{
    float: right;
    margin-right: 2%;
    width: 10%;
  }

  .collar_cont_headPar{
    background: #fff;
    margin: 10px auto;
    padding: 5px 0;
  }
  .collar_cont_head{
    line-height: 40px;
    width: 86%;
    float: left;
    margin-left: 2%;
  }
  .collar_cont_head tr td:nth-child(1){width: 8%;}
  .collar_cont_head tr td:nth-child(2){width: 12%;}
  .collar_cont_head tr td:nth-child(3){width: 8%;text-align-last: center !important;}
  .collar_cont_head tr td:nth-child(4){width: 12%;}
  .collar_cont_head tr td:nth-child(5){width: 8%;}
  .collar_cont_head tr td:nth-child(6){width: 12%;}
  .collar_cont_head tr td:nth-child(7){width: 8%;}
  .collar_cont_head tr td:nth-child(8){width: 12%;}
  .collar_cont_head tr td:nth-child(9){width: 8%;}
  .collar_cont_head tr td:nth-child(10){width: 12%;}
  .collar_cont_head tr td:nth-child(odd){
    padding: 0 5px;
    text-align-last: justify;
  }
  .collar_cont_head tr td input,.collar_cont_head tr td select{
    width: 100%;
  }
  .collar_cont_head tr td span.collar_cont_head_span{
    width: 20%;
    display: block;
    float: left;
    text-align: center;
  }
  .collar_cont_head tr td input.collar_cont_head_age{
    width: 40%;
    display: block;
    float: left;
    position: relative;
    top: 7px;
  }
  .collar_cont_head tr td select.collar_cont_head_ageUnit{
    width: 35%;
    display: block;
    float: left;
  }
  .collar_cont_head tr td input.collar_cont_head_num{
    width: 40%;
    display: block;
    float: left;
    margin-top: 7px;
  }
  .collar_cont_head tr td .collar_cont_head_numText{
    width: 20%;
    display: block;
    float: left;
    text-align: center;
  }
  .collar_cont_head_btn{
    text-align: right;
  }
  .collar_cont_head_btn button{
    height: 32px;
    width: 80%;
    padding: 0 18%;
    margin-left: 10px;
    margin-top: 5px;
  }

  .collar_contentTable tr  input[type=checkbox]{
    position: relative;
    top: 5px;
  }




  /*内容列表*/
  .collar_content{
    width: 100%;
    margin: 15px auto 0;
    background: #fff;
  }
  .collar_contentTable{
    width: 100%;
    text-align: center;
    line-height: 36px;
  }
  .collar_contentTable tr td{
    border: 1px solid #ddd;
  }
  .collar_contentTable tr td:last-child{
    width: 180px !important;
  }
  .collar_contentTable tr td:last-child button{
    width: 40% !important;
  }
  .collar_contentTable thead tr{
    background: #999;
    color: #fff;
    font-weight: bold;
  }
  .collar_contentTable tbody tr{
    cursor: pointer;
  }
  .collar_contentTable tbody tr:hover{
    background: #f6f6ff;
  }
  .collar_contentTable tbody tr td button{
    width: 30%;
    margin: 0 3%;
    height: 28px;
    border-radius: 3px;
    border: 1px solid #ddd;
  }





  /*模态*/
  .Dist_modal>div{
    width: 400px;
    height: 400px;
    background: #fff;
    border-radius: 10px;
  }
  .Dist_modal_head{
    padding-left: 15px;
    background: #999;
    color: #fff;
    line-height: 40px;
    border-radius: 10px 10px 0 0;
    position: relative;
  }
  .Dist_modal_head span{
    position: absolute;
    right: 0;
    top: 0;
    padding: 0 20px;
    font-size: 20px;
    cursor: pointer;
  }
  .Dist_modal_head span:hover{
    background: #bbb;
  }

  .Dist_modal_ul{
    width: 90%;
    margin: 10px auto;
    height: 280px;
    overflow: auto;
    border: 1px solid #f7f7ff;
  }
  .Dist_modal_ul li{
    width: 33.33%;
    float: left;
    margin: 5px auto;
  }
  .Dist_modal_ul li div{
    width: 80%;
    height: 32px;
    line-height: 32px;
    background: #f7f7fe;
    text-align: center;
    border: 1px solid #ddd;
    border-radius: 5px;
    cursor: pointer;
    position: relative;
    margin: 5px auto 0;
  }
  .Dist_modal_ul li div:hover{
    background: #efefef;
  }
  .Dist_modal_ul li div span{
    /*display: none;*/
    position: absolute;
    width: 18px;
    height: 18px;
    border-radius: 9px;
    background: #00a6c8;
    color: #fff;
    line-height: 18px;
    z-index: 10;
    right: -9px;
    top: -9px;
  }
  .Dist_modal_footBtn{
    text-align: right;
  }
  .Dist_modal_footBtn button{
    margin-right: 15%;
    padding: 8px 30px;
    margin-top: 8px;
  }


  /*.zhuxiaoLogin{*/
    /*background: url("../comstyle/img/zhuxiao_03.png") no-repeat left center;*/
    /*background-size: 18px;*/
    /*cursor: pointer;*/
  /*}*/
  /*.zhuxiaoLogin:hover{*/
    /*opacity: .8;*/
  /*}*/
  /*.ts_Text{*/
    /*background: url("../comstyle/img/tishiText_06.png") no-repeat 16px center;*/
    /*background-size: 7px;*/
  /*}*/
  .confirmmsg{
    width: 60%;
    text-align-last: center;
    height: 30px;
    display: block;
    margin: 0 auto;
  }
</style>
